<template>
    <div class="footerBox">
        <div class="footer">
            <van-tabbar route active-color="#fe7923">
                <van-tabbar-item to="/" icon="wap-home-o">首页</van-tabbar-item>
                <van-tabbar-item to="/product/type/index" icon="apps-o">分类</van-tabbar-item>
                <van-tabbar-item  to="/product/cart/index" icon="shopping-cart-o" :badge="cartdata">购物车</van-tabbar-item>
                <van-tabbar-item to="/business/base/index" icon="user-o">我的</van-tabbar-item>
            </van-tabbar>
        </div>
    </div>
</template>
<script setup>
import { getCurrentInstance, reactive, onMounted,ref } from 'vue';
const { proxy } = getCurrentInstance();
const business = reactive(proxy.$cookies.get('business') ?? {})
const cartdata = ref(1);
onMounted(()=>{
    getcart();
})
const getcart = async ()=>{
    let data={
        busid:business.id
    }
    let result = await proxy.$Api.getCart(data);
    //console.log(result.data);
    if(result && result.code === 1){
        cartdata.value = result.data.length;
    }
}
</script>
<style>
    .footer .van-tabbar {
        max-width: 515px;
        left: 50%;
        transform: translateX(-50%);
    }
</style>